import { Switch, TimePicker, Radio } from "antd";
import { useState } from "react";
import { OnOffDesc } from "@/components/render";

const FuncAutoAdd = ({
  skipVerify,
  atuoAgreeTime,
  setAtuoAgreeTime,
  setSkipVerify,
}: any) => {
  // const [isLimit, setIsLimit] = useState(false);
  const [autoAddType, setAutoAddType] = useState(1);
  const [startTime, setStartTime] = useState("");
  const [endTime, setEndTime] = useState("");

  const setTime = ({
    type = autoAddType,
    start = startTime,
    end = endTime,
  }: {
    type?: number;
    start?: string;
    end?: string;
  }) => {
    setAtuoAgreeTime(type === 1 ? [] : [start, end]);
  };

  return (
    <>
      <div className="flex justify-start mb-22">
        <div className="mx-5 min-w-105 text-right"> 自动通过好友: </div>
        <div className="flex items-center">
          <Switch
            size="small"
            onChange={e => {
              setSkipVerify(e);
            }}
            checked={skipVerify}
          />
          <OnOffDesc
            flag={skipVerify}
            desc="开启后，客户添加该企业微信时，无需好友验证，将会自动添加成功"
          />
        </div>
      </div>

      <div className={`flex justify-start mb-22 ${skipVerify ? "" : "none"}`}>
        <div className="mx-5 min-w-105 text-right"> 开启时间: </div>
        <div>
          <div className="justify-start">
            <Radio.Group
              onChange={(e: any) => {
                // console.log(e.target.value);

                setAutoAddType(e.target.value);
                setTime({ type: e.target.value });
              }}
              defaultValue={autoAddType}>
              <Radio value={1}>全天开启</Radio>
              <Radio value={2}>选择时间段开启</Radio>
            </Radio.Group>
          </div>
          <div className={`mt-14 ${autoAddType === 2 ? "" : "none"}`}>
            <TimePicker
              format="HH:mm"
              placeholder="请输入时间"
              onChange={(date: any, dateString: any) => {
                //   item.time = dateString;
                setStartTime(dateString);
                // console.log(date, dateString);
                setTime({ start: dateString });
              }}
            />
            <span className="mx-10">到</span>
            <TimePicker
              format="HH:mm"
              placeholder="请输入时间"
              onChange={(date: any, dateString: any) => {
                //   item.time = dateString;
                setEndTime(dateString);
                setTime({ end: dateString });
                // console.log(date, dateString);
              }}
            />
            <div className="text-grey-400 mt-12">
              在非开启「自动通过好友」时间段添加的好友，需要客服手动通过好友验证后才可添加
            </div>
          </div>
        </div>
      </div>
    </>
  );
};

export default FuncAutoAdd;
